import * as echarts from 'echarts';
import React,{useEffect,useRef} from 'react'
import './Echart.scss'

 function Echart(props) {
    const echarspale = useRef(null)
    let option=props.option
      
    useEffect(()=>{
        // 溢出父容器的问题解决办法 就是加载时机的问题 用异步就可以进行解决 
        let myChart = null
        setTimeout(()=>{
            myChart = echarts.init(echarspale.current);
            myChart.setOption(option)
        },100)
        window.addEventListener('resize', function() {
            myChart.resize();
        });
    })
  return (
    <div ref={echarspale} className="echarstyle">

    </div>
  )
}
export default Echart